/*
 * @Author: TT-hzy
 * @Date: 2024-09-05 17:56:49
 * @LastEditors: TT-hzy
 * @LastEditTime: 2024-12-10 16:03:05
 */
import { type Preset, defineConfig, presetUno, transformerDirectives } from 'unocss'
import { presetApplet, presetRemRpx, transformerAttributify } from 'unocss-applet'

import axwPreset from './base-preset'
const isMp = process.env?.UNI_PLATFORM?.startsWith('mp') ?? false

const presets: Preset[] = []
if (isMp) {
    // 使用小程序预设
    presets.push(
        presetApplet(),

        presetRemRpx()
    )
} else {
    presets.push(
        // 非小程序用官方预设
        presetUno()
        // 支持css class属性化
        // presetAttributify()
    )
}

const shortcuts = {
    'row-start': 'flex-row flex justify-start items-center',
    'row-end': 'flex-row flex justify-end items-center',
    'row-center': 'flex-row flex justify-center items-center',
    'row-between': 'flex-row flex justify-between items-center',
    'row-around': 'flex-row flex justify-around items-center',
    'row-evenly': 'flex-row flex justify-evenly items-center',
    'col-start': 'flex-col flex justify-start items-center',
    'col-end': 'flex-col flex justify-end items-center',
    'col-center': 'flex-col flex justify-center items-center',
    'col-between': 'flex-col flex justify-between items-center',
    'col-around': 'flex-col flex justify-around items-center',
    'col-evenly': 'flex-col flex justify-evenly items-center',
    'flex-bc': 'flex justify-between items-center',
    'flex-center': 'flex items-center justify-center',
    'flex-start': 'flex items-center justify-start'
}

export default defineConfig({
    presets: [...presets, axwPreset()],
    transformers: [
        // 启用 @apply 功能
        transformerDirectives(),
        // 启用 () 分组功能
        // 支持css class组合，eg: `<div class="hover:(bg-gray-400 font-medium) font-(light mono)">测试 unocss</div>`
        // transformerVariantGroup(),
        // Don't change the following order
        transformerAttributify({
            // 解决与第三方框架样式冲突问题
            prefixedOnly: true,
            prefix: 'fg'
        })
    ],
    rules: [
        [
            'p-safe',
            {
                padding:
                    'env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)'
            }
        ],
        ['pt-safe', { 'padding-top': 'env(safe-area-inset-top)' }],
        ['pb-safe', { 'padding-bottom': 'env(safe-area-inset-bottom)' }],
        [/^fz-(\d+)$/, match => ({ 'font-size': match[1] + 'rpx' })],
        [/^w-(\d+)$/, match => ({ width: match[1] + 'rpx' })],
        [/^h-(\d+)$/, match => ({ height: match[1] + 'rpx' })]
    ],

    shortcuts,
    theme: {}
})
